<template>
    <div>
        <div class="header-home-img">
        <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white" >
        <van-swipe-item class="imgs-title" v-for="(item) in list" :key="item.categoryId">
            <img :src="item.imgUrl" alt="">
            </van-swipe-item>
        <!-- <van-swipe-item class="imgs-title">2</van-swipe-item>
        <van-swipe-item class="imgs-title">3</van-swipe-item>
        <van-swipe-item class="imgs-title">4</van-swipe-item> -->
      </van-swipe>
        </div>
    </div>
</template>

<script>
    export default {
        created() {
            this.srcoll()
        },
        data(){
            return{
                list:[]
            };
        },
        methods:{
            async srcoll(){
                const res=await this.$require({
                    url:'/home/sliders',
                    method:'get',
                })
                if(status==0){
                    // const list=[]
                    this.list=res.data.data
                    //  console.log(this.list);
                    //  console.log(res);
                }
            }
        }
    }
</script>

<style lang="scss" scoped>
.header-home-img{
    position: relative;
    top: 0;
}
// .my-swipe .van-swipe-item {
//     // color: #fff;
//     // font-size: 20px;
//     // line-height: 150px;
//     // text-align: center;
//     // background-color: #39a9ed;
//   }
  img{
      width: 375px;
  }
</style>